<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.thymeleaf.org/thymeleaf/layout"
      layout:decorator="layout">
<div layout:fragment="content">
    <div class="page-header">
        <h1>Example page header
            <small>Subtext for header</small>
        </h1>
    </div>
    <p th:text="|Total elements: ${posts.totalElements}|"></p>

    <p th:text="|Total pages: ${posts.totalPages}|"></p>

    <div class="media" th:each="post : ${posts}">
        <div class="media-left">
            <a href="#"><img class="media-object" data-src="holder.js/64x64" alt="64x64"
                             src=""
                             data-holder-rendered="true" style="width: 64px; height: 64px;"/></a>
        </div>
        <div class="media-body">
            <h4 class="media-heading" th:text="${post.title}"></h4>

            <p th:text="${post.teaserText}"></p>
        </div>
    </div>

</div>
</html>